<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../include/tag.jsp" %>
<link rel="stylesheet" href="${ctx}/css/ui/activity/counterfoil.css">
<!-- 票据 -->
<div class="post_main_r">
    <div id="payitemDiv" class="onlyone">
        <div class="post_pay_item">
            <div class="post_pay_item_top">
                <span class="tit01">序号</span><span class="tit02">票据名称</span> <span class="tit03">金额</span>
                <span class="tit03">名额限制</span> <span class="tit03" style="flex: 0.5">操作</span>
            </div>
            <div class="cost_container">

            </div>
        </div>
    </div>
    <div class="post_main_fee2 mt20">
        <a href="javascript:void(0)" class="layui-btn layui-btn-danger addBtn"> <i class="iconfont icon-add btn-icon"></i>
            添加费用项</a>
    </div>
</div>
<script type="text/javascript" charset="utf-8">
    !(function (W, $) {
        txz.Counterfoil = {
            _init : function (opts) {
                var that = this;
                if (!util.isValid(opts.data)) {
                    that.loadData(new Array());
                } else {
                    var data = JSON.parse(opts.data);
                    that.loadData(data);
                }
                that.addEvent();

                function hideDel() {
                    var length = $(".cost_container").find(".cost_content").length;
                    if (length == 1) {
                        $(".cost_container").find(".cost_content").find(".controlClear").hide();
                    }
                }

                hideDel();
            },
            // 加载数据
            loadData : function (data) {
                if (data.length > 0) {
                    var array = new Array();
                    for (var i = 0; i < data.length; i++) {
                        var counterfoil = data[i];
                        console.info(JSON.stringify(counterfoil));
                        var hasBuy = counterfoil.joinNum > 0 ? true : false;
                        array.push('<div class="cost_content cost_item">');
                            array.push('<input type="hidden" class="cost_id" name="counterfoils[' + i + '].id" value="' + counterfoil.id + '">');
                            array.push('<input type="hidden" class="cost_delFlag" name="counterfoils[' + i + '].delFlag" value="' + counterfoil.delFlag + '">');
                            array.push('<input type="hidden" class="cost_sort" name="counterfoils[' + i + '].sort" value="' + counterfoil.sort + '">');
                            array.push('<div class="form_input_number">' + (i + 1) + '</div>');
                            array.push('<div class="form_input_cost form_input_cost_type">' +
                                '<input type="text" name="counterfoils[' + i + '].name" placeholder="请输入票据名称" value="' + counterfoil.name + '" class="input cost_name" >' +
                                '</div>');
                            array.push('<div class="form_input_cost form_input_cost_money">');
                            if (hasBuy == true) {
                                array.push('<input type="text" name="counterfoils[' + i + '].payment" placeholder="请输入金额，免费请填0" value="' + counterfoil.payment + '" class="input cost_payment" readonly >');
                            } else {
                                array.push('<input type="text" name="counterfoils[' + i + '].payment" placeholder="请输入金额，免费请填0" value="' + counterfoil.payment + '" class="input cost_payment" >');
                            }
                            array.push('</div>');
                            array.push('<div class="form_input_cost form_input_cost_money">' +
                                '<input type="text" name="counterfoils[' + i + '].limitNum" placeholder="请输入限制人数" value="' + counterfoil.limitNum + '" class="input cost_limitNum" >' +
                                '</div>');
                            array.push('<div class="form_option">');
                            if (hasBuy == true) {
                                array.push('<a title="删除" class="controlClear" href="javascript:void(0)" style="display: none;"></a>');
                            } else {
                                array.push('<a title="删除" class="controlClear" href="javascript:void(0)"></a>');
                            }
                            array.push('</div>');
                        array.push('</div>');
                    }
                    $(".cost_container").html("").append(array.join(""));
                } else {
                    var array = new Array();
                    array.push('<div class="cost_content cost_item">');
                        array.push('<input type="hidden" class="cost_delFlag" name="counterfoils[0].delFlag" value="">');
                        array.push('<input type="hidden" class="cost_sort" name="counterfoils[0].sort" value="">');
                        array.push('<div class="form_input_number">1</div>');
                        array.push('<div class="form_input_cost form_input_cost_type"><input type="text" name="counterfoils[0].name" placeholder="请输入票据名称" value="" class="input cost_name" ></div>');
                        array.push('<div class="form_input_cost form_input_cost_money"><input type="text" name="counterfoils[0].payment" placeholder="请输入金额，免费请填0" value="" class="input cost_payment" ></div>');
                        array.push('<div class="form_input_cost form_input_cost_money"><input type="text" name="counterfoils[0].limitNum" placeholder="请输入限制人数" value="" class="input cost_limitNum" ></div>');
                        array.push('<div class="form_option">');
                            array.push('<a title="删除" class="controlClear" href="javascript:void(0)" style="display: none;"></a>');
                        array.push('</div>');
                    array.push('</div>');
                    $(".cost_container").html("").append(array.join(""));
                }
            },
            resetIndex : function () {
                // 重新标索引
                $(".cost_container").find(".cost_item").each(function (index, element) {
                    var $cost = $(element);

                    var $costId = $cost.find(".cost_id");
                    updateName($costId, index);

                    var $costDelFlag = $cost.find(".cost_delFlag");
                    updateName($costDelFlag, index);

                    var $costSort = $cost.find(".cost_sort");
                    $costSort.val(index + 1);
                    updateName($costSort, index);

                    $cost.find(".form_input_cost").each(function (i, ele) {
                        var $input = $(ele).find("input");
                        updateName($input, index);
                    });
                    var $select = $cost.find(".restrictControl").find("select");
                    updateName($select, index);
                });

                // 重置下标
                function updateName(ele, index) {
                    var name = $(ele).attr("name");
                    if (util.isValid(name)) {
                        var start = name.substring(0, name.indexOf("[") + 1);
                        var end = name.substring(name.indexOf("]"), name.length);
                        var newName = start + index + end;
                        $(ele).attr("name", newName);
                    }
                }
            },
            // 1.名称不能重名
            // 2.金额只能为数字且小于等于0
            // 3.名额限制只能为数字且大于等于0
            checkCost : function () {
                $(".cost_container").find("input").removeClass("error_bd_red");
                var _payNameArr = new Array();
                var flag = true;
                $(".cost_container").find(".cost_content").each(function (index, element) {
                    var $cost = $(element);
                    var cost_name = $cost.find(".cost_name").val();
                    cost_name = cost_name.replace(/\'/g, '');
                    cost_name = cost_name.replace(/\"/g, '');
                    var cost_payment = $cost.find(".cost_payment").val();
                    var cost_limitNum = $cost.find(".cost_limitNum").val();

                    // 检查空
                    if (!util.isValid(cost_name)) {
                        $cost.find(".cost_name").addClass("error_bd_red");
                        util.layerMsgError("请填写票据名称")
                        flag = false;
                        return flag;
                    }

                    if (!util.isValid(cost_payment)) {
                        $cost.find(".cost_payment").addClass("error_bd_red");
                        util.layerMsgError("请填写金额")
                        flag = false;
                        return flag;
                    }

                    if (!util.isValid(cost_limitNum)) {
                        $cost.find(".cost_limitNum").addClass("error_bd_red");
                        util.layerMsgError("请填写人数上限")
                        flag = false;
                        return flag;
                    }

                    // cost_name
                    for (var m = 0; m < _payNameArr.length; m++) {
                        if (_payNameArr[m] == cost_name) {
                            $cost.find(".cost_name").addClass("error_bd_red");
                            util.layerMsgError("票据名称不能重复")
                            flag = false;
                            return flag;
                        }
                    }
                    _payNameArr.push(cost_name);

                    // cost_payment
                    var isError = false;
                    var desc = "";
                    var reg = /^(([0-9]|([1-9][0-9]{0,9}))((\.[0-9]{1,2})?))$/;
                    if (isNaN(cost_payment) || !reg.test(cost_payment)) {
                        desc = "费用格式不正确";
                        isError = true;
                    } else if (parseFloat(cost_payment) < 0) {
                        desc = "费用必须大于等于0";
                        isError = true;
                    }
                    if (isError) {
                        $cost.find(".cost_payment").addClass("error_bd_red");
                        util.layerMsgError(desc)
                        flag = false;
                        return flag;
                    }

                    // cost_limitNum
                    isError = false;
                    desc = "";
                    if (!util.checkNumber(cost_limitNum)) {
                        desc = "人数上限必须是数字";
                        isError = true;
                    } else if (parseInt(cost_limitNum) < 1) {
                        desc = "人数上限必须大于0";
                        isError = true;
                    }

                    if (isError) {
                        $cost.find(".cost_limitNum").addClass("error_bd_red");
                        util.layerMsgError(desc)
                        flag = false;
                        return flag;
                    }
                    flag = true;
                    $cost.find("input").removeClass("error_bd_red");
                });
                return flag;
            },
            addEvent : function () {
                $('#payitemDiv').delegate('a,input', 'click', function (e) {
                    var $target = $(e.target);
                    if ($target.hasClass("control")) {
                        var restrictControl = $target.closest(".cost_content").find(".restrictControl");
                        var display = $(restrictControl).css("display");
                        if (display == "none") {
                            $(restrictControl).show();
                        } else {
                            $(restrictControl).hide();
                        }
                        e.stopPropagation();
                    } else if ($target.hasClass("controlClear")) {
                        // length = 1表示更新；length=表示新增
                        var length = $target.closest(".cost_content").find(".cost_id").length;
                        if (length == 0) {
                            $target.closest(".cost_content").remove();
                        } else {
                            $target.closest(".cost_content").hide();
                            $target.closest(".cost_content").find(".cost_delFlag").val("1");
                            $target.closest(".cost_content").removeClass("cost_content");
                        }
                        // 重新编号
                        $(".cost_container").find(".cost_content").each(function (index, element) {
                            var $cost = $(element);
                            $cost.find(".form_input_number").text(index + 1);
                        });
                        // 如果只有一种票了，则不能删除
                        length = $(".cost_container").find(".cost_content").length;
                        if (length == 1) {
                            $(".cost_container").find(".cost_content").find(".controlClear").hide();
                        }
                        e.stopPropagation();
                    } else if ($target.hasClass("cost_payment")) {
                        var readonly = $target.attr("readonly");
                        if (util.isValid(readonly)) {
                            util.layerMsgError("已经有报名的收费项不能修改金额")
                        }
                        e.stopPropagation();
                    }
                });

                $(".post_main_fee2").delegate('.addBtn', 'click', function () {
                    var length = $(".cost_container").find(".cost_content").length;
                    var array = new Array();
                    array.push('<div class="cost_content cost_item">');
                        array.push('<input type="hidden" class="cost_sort" name="counterfoils[' + (length) + '].sort" />');
                        array.push('<div class="form_input_number">' + (length + 1) + '</div>');
                        array.push('<div class="form_input_cost form_input_cost_type"><input type="text" name="counterfoils[' + (length) + '].name" placeholder="请输入票据名称" class="input cost_name" value=""></div>');
                        array.push('<div class="form_input_cost form_input_cost_money"><input type="text" name="counterfoils[' + (length) + '].payment" placeholder="请输入金额，免费请填0" class="input cost_payment" value=""></div>');
                        array.push('<div class="form_input_cost form_input_cost_money"><input type="text" name="counterfoils[' + (length) + '].limitNum" placeholder="请输入限制人数" class="input cost_limitNum" value=""></div>');
                        array.push('<div class="form_option">');
                            array.push('<a title="删除" class="controlClear"></a>');
                        array.push('</div>');
                    array.push('</div>');

                    $(".cost_container").append(array.join(""));
                    $(".cost_container").find(".cost_content").find(".controlClear").show();
                })
            }
        }
    })(window, jQuery);
</script>